<style>
    /*样式写这里*/
    .demo-table table tbody tr td span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        width: 580px;
        display: block;
    }

</style>
<div class="bt-form">
    <div class="bt-w-main">
        <!--菜单部分-->
        <div class="bt-w-menu">
            <p onclick="demo.get_service()">服务状态</p>
            <p onclick="demo.Install_uninstall()">安装卸载pgsql</p>
            <p onclick="demo.config_edit()">配置修改</p>
            <p onclick="demo.get_clint_config()">客户端认证配置修改</p>
            <p onclick="demo.get_database_list()">数据库列表</p>
            <p onclick="demo.get_create_user_template()">创建数据库</p>
            <p onclick="demo.get_data_directory()">存储位置</p>
            <p onclick="demo.get_port()">端口</p>
            <p onclick="demo.get_pgsql_current_status()">当前状态</p>
            <p onclick="demo.get_pgsql_status()">性能调整</p>
            <p onclick="demo.get_pgsql_log()">日志</p>
            <!--<p onclick="demo.get_pgsql_log()">日志</p>-->
            <p onclick="demo.get_slow_pgsql_log()">慢日志</p>
        </div>
        <!--内容部分-->
        <div class="bt-w-con pd15">
            <div class="plugin_body"></div>
        </div>
    </div>
</div>


<!--JS脚本部分，不要将JS脚本写在其它地方-->
<script type="text/javascript">

    //定义窗口尺寸
    $('.layui-layer-page').css({'width': '900px'});

    //左测菜单切换效果
    $(".bt-w-menu p").click(function () {
        $(this).addClass('bgw').siblings().removeClass('bgw')
    });

    /**
     * 插件交互对象
     * 您的所有JS代码可以写在里面
     * 若不习惯JS的面向对象编程，可删除此对象，使用传统函数化的方式编写
     * */
    var demo = {
        //构造概览内容
        get_index: function (args) {
            alert(args);
            $('.plugin_body').html("<h1 style='text-align:center;margin-top:30%;'>测试插件!</h1>");
        },

        get_logs: function (p) {//获取面板日志
            if (p == undefined) p = 1;
            request_plugin('pgsql_manager', 'get_logs', {p: p, callback: 'demo.get_logs'}, function (rdata) {
                var log_body = '';
                for (var i = 0; i < rdata.data.length; i++) {
                    log_body += '<tr><td>' + rdata.data[i].addtime + '</td><td><span title="' + rdata.data[i].log + '">' + rdata.data[i].log + '</span></td></tr>'
                }
                var my_body = '<div class="demo-table"><div class="divtable">'
                    + '<table class="table table-hover">'
                    + '<thead>'
                    + '<tr><th width="150">时间</th><th>详情</th></tr>'
                    + '</thead>'
                    + '<tbody>' + log_body + '</tbody>'
                    + '</table>'
                    + '</div><div class="page" style="margin-top:15px">' + rdata.page + '</div</div>';

                $('.plugin_body').html(my_body);
            });
        },
        get_data: function (p) {
            if (p == undefined) p = 1;
            request_plugin('pgsql_manager', 'get_data', {p: p, callback: 'demo.get_data'}, function (rdata) {
                var my_body = "<h1>" + rdata['data'] + "<h1/>";
                $('.plugin_body').html(my_body);
            });
        },
        get_service: function (p) {//获取服务状态
            if (p == undefined) p = 1;
            request_plugin('pgsql_manager', 'get_service', {p: p, callback: 'demo.get_service'}, function (rdata) {
                if (rdata.data[1] == 1) {
                    var Style_status = "color: #20a53a; margin-left: 3px;";
                    var Class_status = "glyphicon glyphicon glyphicon-play";
                    var Start = "none";
                    var Stop = "";
                } else {
                    var Style_status = "color: red; margin-left: 3px;";
                    var Class_status = "glyphicon glyphicon-pause";
                    var Start = "";
                    var Stop = "none";
                }
                var my_body = '<div class="soft-man-con bt-form">' +
                    '<p class="status">当前状态：<span>' + rdata.data[0] + '</span>' +
                    '<span style="' + Style_status + '" class="' + Class_status + '"></span>' +
                    '</p>' +
                    '<div class="sfm-opt">' +
                    '<button class="btn btn-default btn-sm" style="display: ' + Start + '" onclick="bt.pub.set_server_status(\'pgsql\',\'start\')">启动</button>' +
                    '<button class="btn btn-default btn-sm" style="display: ' + Stop + '"  onclick="bt.pub.set_server_status(\'pgsql\',\'stop\')">停止</button>' +
                    '<button class="btn btn-default btn-sm" onclick="bt.pub.set_server_status(\'pgsql\',\'restart\')">重启</button>' +
                    '<button class="btn btn-default btn-sm" onclick="bt.pub.set_server_status(\'pgsql\',\'reload\')">重载配置</button></div></div>';
                $('.plugin_body').html(my_body);
            });
        },
        Install_uninstall: function () {//安装卸载pgsql
            var pgsql_version = '';
            var pgsql_install_info = '';
            var is_install = '';
            var pgsql_install_info_body = '';
            var install_style = '';
            var uninstall_style = '';
            var show_install_select = '';
            request_plugin('pgsql_manager', 'Install_uninstall', {get_pgsql_version: 1, get_pgsql_install_info: 1, callback: 'demo.Install_uninstall'}, function (rdata) {
                pgsql_version = rdata.data['pgsql_version'];
                is_install = rdata.data['is_install'];
                pgsql_install_info = rdata.data['pgsql_install_info'];
                if (is_install == "已经安装") {
                    is_install = "  当前已安装" + pgsql_version;
                    install_style = 'style="display: none"';
                    show_install_select = "none";
                } else if (is_install == "未安装") {
                    uninstall_style = 'style="display: none"'
                }
                for (var i in pgsql_install_info) {
                    pgsql_install_info_body += '<option   value="' + pgsql_install_info[i].down_url + '">' + pgsql_install_info[i].pgsql_version + '</option>'
                }

                var my_body = '<div>\n' +
                    '    <div class="layui-layer-title" style="cursor: move;">pgsql软件安装卸载</div>\n' +
                    '    <div id="" class="layui-layer-content">\n' +
                    ' <div class="bt-form pd20 pb70 c6">\n' +
                    ' <div class="version line" style="display: ' + show_install_select + '">选择版本：' +
                    '<select name="pgsql_version" class="bt-input-text" style="margin-left:30px;">\n' +
                    pgsql_install_info_body +
                    '            </select>'
                    + '</div> ' + is_install +
                    '<button type="button" class="btn btn-danger btn-sm btn-title pgsql_unInstall" ' + uninstall_style + '>卸载</button>' +
                    '<button type="button" class="btn btn-success btn-sm btn-title bi-btn pgsql_Install" ' + install_style + '>安装</button>' +
                    '        </div>\n' +
                    '    </div>\n' +
                    '</div>';
                $('.plugin_body').html(my_body);

                $(".pgsql_Install").click(function () {
                    var pgsql_version = $("select[name=pgsql_version]").val();
                    request_plugin('pgsql_manager', 'Install_uninstall', {pgsql_version: pgsql_version, callback: 'demo.Install_uninstall'}, function (rdata) {
                        alert(rdata.data);

                        function func() {
                            request_plugin('pgsql_manager', 'Install_uninstall', {get_pgsql_install_log: "1", callback: 'demo.Install_uninstall'}, function (rdata) {
                                var my_body = '<textarea readonly="" style="margin: 0px;width: 515px;height: 440px;background-color: #333;color:#fff; padding:0 5px" >' + rdata.data + '</textarea><br>正在安装请等待...';
                                $('.plugin_body').html(my_body);
                                if (rdata.data.indexOf("SUCCESS") > 0) {
                                    demo.Install_uninstall();
                                    clearTimeout(timer1_get_pgsql_install_log);//清除定时器
                                    $.ajax({
                                        type: 'POST',
                                        url: '/firewall?action=AddAcceptPort',//放行端口
                                        data: {port: 5432, type: "port", ps: "pgsql"},
                                        timeout: 3600,
                                        success: function (rdata) {
                                            if (!callback) {
                                                layer.msg(rdata.msg, {icon: rdata.status ? 1 : 2});
                                                return;
                                            }
                                            return callback(rdata);
                                        },
                                        error: function (ex) {
                                            if (!callback) {
                                                layer.msg('请求过程发现错误!', {icon: 2});
                                                return;
                                            }
                                            return callback(ex);
                                        }
                                    });
                                }
                            },);
                        }

                        timer1_get_pgsql_install_log = setInterval(function () {
                            //定时器要执行的代码
                            func()
                        }, 2500);

                    },);
                });

                $(".pgsql_unInstall").click(function () {
                    var r = confirm("你确定要卸载数据库吗？,请谨慎操作！");
                    if (r == true) {
                        var r1 = confirm("你是否要将备份文件一起删掉？,请谨慎操作！");
                        var del_bak = 0;
                        if (r1 == true) {
                            del_bak = 1
                        }
                        request_plugin('pgsql_manager', 'Install_uninstall', {pgsql_unInstall: "1", del_bak: del_bak, callback: 'demo.Install_uninstall'}, function (rdata) {
                            alert(rdata.data);
                            demo.Install_uninstall();
                        },);
                    }
                });

            },);
        },
        config_edit: function (p) {//获取配置文件信息
            if (p == undefined) p = 1;
            request_plugin('pgsql_manager', 'get_config', {p: p, callback: 'demo.config_edit'}, function (rdata) {
                var my_body = '<div class="soft-man-con bt-form">\n' +
                    '    <p style="color: #666; margin-bottom: 7px">提示：Ctrl+F 搜索关键字，Ctrl+G 查找下一个，Ctrl+S 保存，Ctrl+Shift+R 查找替换!</p>\n' +
                    '    <textarea class="bt-input-text" style="height: 450px; line-height: 18px;width: 600px" id="text_conf">\n' + rdata.data +
                    '</textarea>\n' +
                    '    <button onclick="demo.save_conf()" class="btn btn-success btn-sm" style="margin-top:10px;">保存</button>\n' +
                    '    <ul class="help-info-text c7">\n' +
                    '        <li>此处为pgsql主配置文件,若您不了解配置规则,请勿随意修改。</li>\n' +
                    '    </ul>\n' +
                    '</div>';
                $('.plugin_body').html(my_body);
            });
        },
        save_conf: function (p) {//保存配置文件
            if (p == undefined) p = 1;
            var text_conf = $("#text_conf").val();
            request_plugin('pgsql_manager', 'save_conf', {p: p, text_conf: text_conf, callback: 'demo.save_conf'}, function (rdata) {
                alert(rdata.data)
            });
        },
        get_clint_config: function (p) {// 获取 pg_hba.conf 客户端认证配置文件
            if (p == undefined) p = 1;
            request_plugin('pgsql_manager', 'get_clint_config', {p: p, callback: 'demo.get_clint_config'}, function (rdata) {
                var my_body = '<div class="soft-man-con bt-form">\n' +
                    '    <p style="color: #666; margin-bottom: 7px">提示：此配置文件可以配置允许哪些用户连接到哪个数据库，允许哪些IP或者哪个网段的IP连接到本服务器，以及指定连接时使用的身份验证模式!</p>\n' +
                    '    <textarea class="bt-input-text" style="height: 400px; line-height: 18px;width: 650px" id="text_conf">\n' + rdata.data +
                    '</textarea><br>' +
                    // '<button name="bt_pgsql_restart" class="btn btn-success btn-sm mr5 ml5 bt_mysql_restart"  onclick="bt.pub.set_server_status(\'pgsql\',\'reload\')">reload重载数据库</button>' +
                    '    <button onclick="demo.save_get_clint_conf()" class="btn btn-success btn-sm" style="margin-top:10px;">保存</button>\n' +
                    '    <ul class="help-info-text c7">\n' +
                    '        <li>此处为pgsql客户端认证配置文件,若您不了解配置规则,请勿随意修改。</li>\n' +
                    '    </ul>\n' +
                    '</div>';
                $('.plugin_body').html(my_body);
            });
        },
        save_get_clint_conf: function (p) {//保存客户端认证配置文件
            if (p == undefined) p = 1;
            var text_conf = $("#text_conf").val();
            request_plugin('pgsql_manager', 'save_get_clint_conf', {p: p, text_conf: text_conf, callback: 'demo.save_get_clint_conf'}, function (rdata) {
                alert(rdata.data)
            });
        },
        get_database_list: function (p) {//获取数据库名称列表
            if (p == undefined) p = 1;
            request_plugin('pgsql_manager', 'get_database_list', {p: p, callback: 'demo.get_database_list'}, function (rdata) {
                var data_body = '';
                for (var i in rdata.data) {
                    var user_permission = '';
                    if (rdata.data[i].listen_ip == "127.0.0.1/32") {
                        user_permission = '本机'
                    } else if (rdata.data[i].listen_ip == "0.0.0.0/0") {
                        user_permission = '所有人'
                    } else {
                        user_permission = rdata.data[i].listen_ip
                    }
                    data_body += '<tr>\n' +
                        '            <td>' + rdata.data[i].database + '</td>\n' +
                        '            <td>' + rdata.data[i].username + '</td>\n' +
                        '            <td>' + rdata.data[i].password + '<button onclick="demo.modify_pgsql_password(\'' + rdata.data[i].password + '\',\'' + rdata.data[i].username + '\')">修改密码</button></td>\n' +
                        '            <td>' + user_permission + '<button onclick="demo.modify_pgsql_listen_ip(\'' + rdata.data[i].listen_ip + '\',\'' + rdata.data[i].username + '\')">修改权限</button></td>\n' +
                        // '            <td>' + rdata.data[i].listen_ip + '</td>\n' +
                        '            <td> ' +
                        '<button  onclick="demo.pgsql_back(\'' + rdata.data[i].database + '\')"  >备份</button>|' +
                        // '<button  onclick="demo.pgsql_back_import(\'' + rdata.data[i].database + '\')"  >导入</button>|' +
                        '<button  onclick="demo.get_import_bak_list(\'' + rdata.data[i].database + '\')"  >导入</button>|' +
                        '<button  onclick="demo.get_pgsql_bak_list(\'' + rdata.data[i].database + '\')"  >备份文件列表</button>|' +
                        '<button  onclick="demo.del_pgsql_db(\'' + rdata.data[i].database + '\')"  >删除</button>' +
                        '</td>\n' +
                        '        </tr>'
                }
                var my_body = '<div class="tablescroll">\n' +
                    '    <table class="table table-hover" cellspacing="0" cellpadding="0" border="0" style="border: 0 none;">\n' +
                    '        <thead>\n' +
                    '        <tr>\n' +
                    '            <th>数据库名</th>\n' +
                    '            <th>用户名</th>\n' +
                    '            <th>密码</th>\n' +
                    '            <th>访问权限</th>\n' +
                    '            <th>操作</th>\n' +
                    '        </tr>\n' +
                    '        </thead>\n' +
                    '        <tbody>\n' +
                    data_body +
                    '        </tbody>\n' +
                    '    </table>\n' +
                    '</div>';
                $('.plugin_body').html(my_body);
            });
            $("input[type='text']").on('input', function () {
                $(this).css("background-color", "red");
            });
        },
        get_import_bak_list: function (database) {//获取导入的文件列表
            request_plugin('pgsql_manager', 'get_import_bak_list', {callback: 'demo.get_import_bak_list'}, function (rdata) {
                var data_body = '';
                for (var i in rdata.data) {
                    var filepath = "/www/backup/pgsql_bak/upload/" + rdata.data[i].filename;
                    data_body += '<tr>\n' +
                        '                <td>' + rdata.data[i].filename + '</td>\n' +
                        '                <td>' + rdata.data[i].create_time + '</td>\n' +
                        '                <td>' + rdata.data[i].file_size + '</td>\n' +
                        '                <td style="text-align:right"><a class="btlink" herf="javascrpit:;" onclick="demo.restore_import_bak(\'' + filepath + '\',\'' + database + '\')">导入</a></td>\n' +
                        '                <td style="text-align:right"><a class="btlink" herf="javascrpit:;" onclick="demo.del_import_pgsql_bak(\'' + rdata.data[i].filename + '\')">删除</a></td>\n' +
                        '            </tr>'
                }
                var my_body = '<div class="pd15">\n' +
                    '    <button class="btn btn-default btn-sm" onclick="demo.pgsql_back_import(\'' + database + '\')">从本地上传</button>\n' +
                    '    <div class="divtable mtb15" style="max-height:300px; overflow:auto">\n' +
                    '        <table id="DataInputList" class="table table-hover">\n' +
                    '            <thead>\n' +
                    '            <tr>\n' +
                    '                <th>文件名</th>\n' +
                    '                <th>修改时间</th>\n' +
                    '                <th>大小</th>\n' +
                    '                <th style="text-align:right;">操作</th>\n' +
                    '            </tr>\n' +
                    '            </thead>\n' +
                    '            <tbody>\n' +
                    data_body +
                    '            </tbody>\n' +
                    '        </table>\n' +
                    '    </div>\n' +
                    '</div>';
                $('.plugin_body').html(my_body);
            });
        }
        ,
        pgsql_back_import: function (database) {//从本地导入文件
            var my_body = '<div class="layui-layer-title" style="cursor: move;">上传文件 --- <span style="color:red;">请上传dmp文件或gz压缩包</span>' +
                '</div>\n' +
                '<br>\n' +
                // '<h1>要恢复的数据库: ' + database + '</h1>' +
                '<input type="file" name="bakfile" id="id_bakfile"/>\n' +
                '<br>\n' +
                '<input type="button" id="bakfile_submit" value="上传并恢复数据库"/>';
            $('.plugin_body').html(my_body);
            $('#bakfile_submit').bind("click", function () {
                var file = $('#id_bakfile')[0].files[0];
                var filename = file['name'];
                if (!file.type.indexOf("gzip") || !filename.indexOf("dump")) {
                    alert("文件类型不正确！");
                    return false;
                }
                var upload_path = '/www/backup/pgsql_bak/upload';
                var upload_url = '/files?action=UploadFile&path=' + upload_path + '&codeing=byte';
                var formData = new FormData();
                formData.append("database", database);
                formData.append("zunfile", file);
                $.ajax({
                    url: upload_url,
                    type: "POST",
                    // headers: {"X-CSRFToken": $.cookie('csrftoken')},
                    data: formData,
                    contentType: false,
                    processData: false,
                    success: function (data) {
                        // $(".tishi").html("上传成功")
                        alert("上传成功");
                        demo.get_import_bak_list(database)
                    }
                });
                // request_plugin('pgsql_manager', 'pgsql_back_import', {filepath: upload_path + filename, database: database, callback: 'demo.pgsql_back_import'}, function (rdata) {
                //     alert(rdata.data)
                // });
            })
        },
        restore_import_bak: function (filepath, database) {//恢复导入的数据库
            request_plugin('pgsql_manager', 'pgsql_back_import', {filepath: filepath, database: database, callback: 'demo.pgsql_back_import'}, function (rdata) {
                alert(rdata.data)
            });
        },
        get_create_user_template: function (p) {//获取创建数据库用户模板
            if (p == undefined) p = 1;
            var my_body = '<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"><\/script>' +
                '<div class="plugin_body create_user_template">\n' + '<h1 class="text-center">{{ message }}</h1>' +
                '    <div class="soft-man-con bt-form">\n' +
                '        <div class="tab-db-status">\n' +
                '            <div class="line ">\n' +
                '                <span class="tname">数据库名</span>\n' +
                '                <div class="info-r ">\n' +
                '                    <input v-model="message1" name="database" class="bt-input-text mr5 key_buffer_size" type="text" style="width:65%" value="" required>\n' +
                '                    <span class="c9 mt10 mr5"> </span>\n' +
                '                </div>\n' +
                '            </div>\n' +
                '\n' +
                '            <div class="line ">\n' +
                '                <span class="tname">用户名</span>\n' +
                '                <div class="info-r ">\n' +
                '                    <input  name="username" class="bt-input-text mr5 key_buffer_size" type="text" style="width:65%" v-bind:value="message1">\n' +
                '                    <span class="c9 mt10 mr5">  </span>\n' +
                '                </div>\n' +
                '            </div>\n' +
                '\n' +
                '            <div class="line ">\n' +
                '                <span class="tname">密码</span>\n' +
                '                <div class="info-r ">\n' +
                '                    <input name="password" class="bt-input-text mr5 key_buffer_size" type="text" style="width:65%" value="" required>\n' +
                '                    <span class="c9 mt10 mr5"> </span>\n' +
                '                </div>\n' +
                '            </div>\n' +
                '\n' +

                '            <div class="line ">\n' +
                '                <span class="tname">访问权限</span>\n' +
                '                <div class="info-r ">\n' +
                // '                    <input name="listen_ip" class="bt-input-text mr5 key_buffer_size" type="text" style="width:65%" value="">\n' +
                '<select name="listen_ip"  class="bt-input-text mr5 password_YzRFXP" style="width:330px">' +
                '<option value="127.0.0.1/32">本机</option>' +
                '<option value="0.0.0.0/0">所有人</option>' +
                '<option value="ip">指定网段</option>' +
                '</select>' +
                '<input  class="bt-input-text mr5" type="text" name="assignation_network" placeholder="如: 192.168.1.0/24" style="width: 203px; display: none;" required>' +
                '                    <span class="c9 mt10 mr5"> </span>\n' +
                '                </div>\n' +
                '            </div>\n' +
                '\n' + '' +
                '            <div class="line ">\n' +
                '                <div class="info-r  ml0">\n' +
                // '                    <button name="bt_pgsql_restart" class="btn btn-success btn-sm mr5 ml5 bt_mysql_restart" onclick="bt.pub.set_server_status(\'pgsql\',\'reload\')">reload重载数据库</button>\n' +
                '                    <button name="bt_pgsql_save" class="btn btn-success btn-sm mr5 ml5 bt_mysql_save" onclick="demo.create_user()">保存</button>\n' +
                '                </div>\n' +
                '            </div>\n' +
                '        </div>\n' +
                '    </div>\n' +
                '</div>';
            $('.plugin_body').html(my_body);
            new Vue({
                el: '.create_user_template',
                data: {
                    message: '创建数据库',
                    message1: '',
                }
            });
            $("input[name=password]").val(bt.get_random(16));
            $("select[name=listen_ip]").click(function () {
                if ($("select[name=listen_ip]").attr('checked') == undefined) {
                    var listen_ip_val = $("select[name=listen_ip]").val();
                    if (listen_ip_val == "ip") {
                        $("input[name=assignation_network]").css('display', 'inline-block');
                    } else {
                        $("input[name=assignation_network]").css('display', 'none');
                    }
                }
            });
        },
        create_user: function (p) {//创建数据库和用户
            if (p == undefined) p = 1;
            var username = $("input[name=username]").val();
            var password = $("input[name=password]").val();
            var database = $("input[name=database]").val();
            var listen_ip = $("select[name=listen_ip]").val();
            if (listen_ip == "ip") {
                listen_ip = $("input[name=assignation_network]").val()
            }
            var regEn = /[`~!@#$%^&*()_+<>?:"{},.\\/;'[\]]/im,
                regCn = /[·！#￥（——）：；“”‘、，|《。》？、【】[\]]/im;
            if (regEn.test(database) || regCn.test(database) || database == "") {
                alert("数据库名称不能包含特殊字符.");
                return false;
            }
            request_plugin('pgsql_manager', 'create_user', {p: p, username: username, password: password, database: database, listen_ip: listen_ip, callback: 'demo.create_user'}, function (rdata) {
                alert(rdata.data);
                demo.get_database_list();
            });
        },
        get_data_directory: function (p) {//获取储存路径
            if (p == undefined) p = 1;
            request_plugin('pgsql_manager', 'get_data_directory', {p: p, callback: 'demo.get_data_directory'}, function (rdata) {
                var my_body = '<div class="info-r  ml0">' +
                    '<input name="datadir" class="bt-input-text mr5 datadir" type="text" style="width:330px" value="' + rdata.data + '">' +
                    // '<span data-id="datadir" class="glyphicon cursor mr5 glyphicon-folder-open icon_datadir"></span>' +
                    '<button name="btn_change_path" onclick="demo.modify_data_directory()" class="btn btn-success btn-sm mr5 ml5 btn_change_path">迁移</button>' +
                    '</div>';
                $('.plugin_body').html(my_body);
            });
        },
        modify_data_directory: function (p) {//修改储存位置
            if (p == undefined) p = 1;
            var data_directory = $("input[name=datadir]").val();
            request_plugin('pgsql_manager', 'modify_data_directory', {p: p, data_directory: data_directory, callback: 'demo.modify_data_directory'}, function (rdata) {
                alert(rdata.data)
            });
        },
        get_port: function (p) {//获取端口号
            if (p == undefined) p = 1;
            request_plugin('pgsql_manager', 'get_port', {p: p, callback: 'demo.get_port'}, function (rdata) {
                var my_body = '<div class="info-r  ml0">' +
                    '<input name="port" class="bt-input-text mr5 port" type="number" min="1" max="65534" style="width:100px" value="' + rdata.data + '">' +
                    '<button name="btn_change_port" class="btn btn-success btn-sm mr5 ml5 btn_change_port" onclick="demo.save_port()">修改</button>' +
                    '</div>';
                $('.plugin_body').html(my_body);
            });
        },
        save_port: function (p) {//修改端口号
            if (p == undefined) p = 1;
            var port = $("input[name=port]").val();
            request_plugin('pgsql_manager', 'save_port', {p: p, port: port, callback: 'demo.save_port'}, function (rdata) {
                alert(rdata.data);
                $.ajax({
                    type: 'POST',
                    url: '/firewall?action=AddAcceptPort',//放行端口
                    data: {port: port, type: "port", ps: "pgsql"},
                    timeout: 3600,
                    success: function (rdata) {
                        if (!callback) {
                            layer.msg(rdata.msg, {icon: rdata.status ? 1 : 2});
                            return;
                        }
                        return callback(rdata);
                    },
                    error: function (ex) {
                        if (!callback) {
                            layer.msg('请求过程发现错误!', {icon: 2});
                            return;
                        }
                        return callback(ex);
                    }
                });

            },);
        },
        get_pgsql_current_status: function (p) {//获取pgsql当前状态
            if (p == undefined) p = 1;
            $('.plugin_body').html('<h1 class="text-center">数据正在加载中，请稍等...</h1>');
            request_plugin('pgsql_manager', 'get_pgsql_current_status', {p: p, callback: 'demo.get_pgsql_current_status'}, function (rdata) {
                var my_body1 = '';
                for (var i in rdata.data) {
                    my_body1 += '<tr>\n' +
                        '            <th>' + i + '</th>\n' +
                        '            <td>' + rdata.data[i] + '</td>\n' +
                        '        </tr>'
                }
                var my_body = '<div class="divtable">\n' +
                    '    <table class="table table-hover table-bordered" style="width: 490px;margin-bottom:10px;background-color:#fafafa">\n' +
                    '        <tbody>\n' +
                    my_body1 +
                    '        </tbody>\n' +
                    '    </table>\n' +
                    '</div>';
                $('.plugin_body').html(my_body);
            });
        },
        get_pgsql_status: function (p) {//获取pgsql性能调整信息
            if (p == undefined) p = 1;
            request_plugin('pgsql_manager', 'get_pgsql_status', {p: p, callback: 'demo.get_pgsql_status'}, function (rdata) {
                var my_body1 = '';
                my_body1 += '<div class="line "><span class="tname">listen_addresses</span><div class="info-r ">' +
                    '<select name="listen_addresses" class="bt-input-text mr5 key_buffer_size" unit="">' +
                    '<option value="\'*\'">所有人</option>' +
                    '<option value="\'127.0.0.1\'">本机</option>' +
                    '</select>' +
                    // '<input name="listen_addresses" class="bt-input-text mr5 key_buffer_size" type="text" style="width:70px" unit="" value="' + rdata["listen_addresses"][0] + '"> ' +
                    '<span class="c9 mt10 mr5"> <font>' + rdata["listen_addresses"][2] + '</font></span></div></div>';
                for (var i in rdata) {
                    if (i == "listen_addresses" || i == "status") {
                        continue
                    }
                    my_body1 += '<div class="line "><span class="tname">' + i + '</span><div class="info-r "><input name="' + i + '" class="bt-input-text mr5 key_buffer_size" type="number" style="width:70px" unit="' + rdata[i][1] + '" value="' + rdata[i][0] + '"> <span class="c9 mt10 mr5">' + rdata[i][1] + ', <font>' + rdata[i][2] + '</font></span></div></div>'
                }
                var my_body = '<div class="soft-man-con bt-form">' +
                    '<div class="tab-db-status">' +
                    my_body1 +
                    '<div class="line "><div class="info-r  ml0">' +
                    '<button name="bt_pgsql_restart" class="btn btn-success btn-sm mr5 ml5 bt_mysql_restart"  onclick="bt.pub.set_server_status(\'pgsql\',\'restart\')">重启数据库</button>' +
                    '<button name="bt_pgsql_save" class="btn btn-success btn-sm mr5 ml5 bt_mysql_save" onclick="demo.save_pgsql_status()">保存</button></div></div></div></div>';
                $('.plugin_body').html(my_body);
            },);
        },
        save_pgsql_status: function (p) {//保存pgsql性能调整信息
            if (p == undefined) p = 1;
            var status_data = {};
            request_plugin('pgsql_manager', 'get_pgsql_status', {p: p, callback: 'demo.get_pgsql_status'}, function (rdata) {
                this.pgsql_status_info = rdata;
                for (var i in this.pgsql_status_info) {
                    status_data[i] = $("input[name=" + i + "]").val() + $("input[name=" + i + "]").attr("unit")
                }
                status_data["listen_addresses"] = $("select[name=listen_addresses]").val() + $("select[name=listen_addresses]").attr("unit");
                request_plugin('pgsql_manager', 'save_pgsql_status', {p: p, status_data: JSON.stringify(status_data), callback: 'demo.save_pgsql_status'}, function (rdata) {
                    alert(rdata.data)
                },);
            },);


        },
        get_pgsql_log: function (p) {
            if (p == undefined) p = 1;
            request_plugin('pgsql_manager', 'get_pgsql_log', {p: p, callback: 'demo.get_pgsql_log'}, function (rdata) {
                var my_body = '<textarea readonly="" style="margin: 0px;width: 515px;height: 440px;background-color: #333;color:#fff; padding:0 5px" >' + rdata.data + '</textarea>';
                $('.plugin_body').html(my_body);
            },);
        },
        get_slow_pgsql_log: function () {//pgsql慢日志查询
            request_plugin('pgsql_manager', 'get_slow_pgsql_log', {callback: 'demo.get_slow_pgsql_log'}, function (rdata) {
                var my_body = '<textarea readonly="" style="margin: 0px;width: 515px;height: 440px;background-color: #333;color:#fff; padding:0 5px"  >' + rdata.data + '</textarea>';
                $('.plugin_body').html(my_body);
            },);
        },
        pgsql_back: function (database) {//备份数据库
            request_plugin('pgsql_manager', 'pgsql_back', {database: database, callback: 'demo.pgsql_back'}, function (rdata) {
                alert(rdata.data);
            },);
        },
        get_pgsql_bak_list: function (database) {//获取数据库备份文件列表
            request_plugin('pgsql_manager', 'get_pgsql_bak_list', {database: database, callback: 'demo.get_pgsql_bak_list'}, function (rdata) {
                var data_body = '';
                for (var i in rdata.data) {
                    data_body += '<tr>\n' +
                        '        <td>' + rdata.data[i].filename + '</td>\n' +
                        '        <td>' + rdata.data[i].file_size + '</td>\n' +
                        '        <td>' + rdata.data[i].create_time + '</td>\n' +
                        '        <td><button onclick="demo.pgsql_restore(\'' + rdata.data[i].filename + '\')">恢复</button>|' +
                        '<a target="_blank" href="/download?filename=' + rdata.data[i].file_path + '&name=' + rdata.data[i].filename + '">下载</a>|' +
                        '<button onclick="demo.del_pgsql_bak(\'' + rdata.data[i].filename + '\')">删除</button></td>\n' +
                        '    </tr>'
                }
                var my_body = '<table class="table table-hover">\n' +
                    '    <thead>\n' +
                    '    <tr>\n' +
                    '        <th>文件名称</th>\n' +
                    '        <th>文件大小</th>\n' +
                    '        <th>备份时间</th>\n' +
                    '        <th>操作</th>\n' +
                    '    </tr>\n' +
                    '    </thead>\n' +
                    '    <tbody>\n' +
                    data_body +
                    '    </tbody>\n' +
                    '</table> ';
                $('.plugin_body').html(my_body);
            },);
        },
        del_pgsql_db: function (database) {//删除数据库
            var del_bak = 0;
            var r = confirm("你确定要删除数据库吗？,请谨慎操作！");
            if (r == true) {
                var r1 = confirm("你是否要把此数据库的备份文件一起删除？");
                if (r1 == true) {
                    del_bak = 1
                }
                request_plugin('pgsql_manager', 'del_pgsql_db', {database: database, del_bak: del_bak, callback: 'demo.del_pgsql_db'}, function (rdata) {
                    alert(rdata.data);
                    demo.get_database_list()
                },);
            } else {
                //
            }
        },
        del_pgsql_bak: function (filename) {//删除数据库备份文件
            request_plugin('pgsql_manager', 'del_pgsql_bak', {filename: filename, callback: 'demo.del_pgsql_bak'}, function (rdata) {
                alert(rdata.data);
                var database = filename.split("_")[0];
                demo.get_pgsql_bak_list(database)
            },);
        },
        del_import_pgsql_bak: function (filename) {//删除导入的数据库备份文件
            request_plugin('pgsql_manager', 'del_import_pgsql_bak', {filename: filename, callback: 'demo.del_import_pgsql_bak'}, function (rdata) {
                alert(rdata.data);
            },);
        },
        pgsql_restore: function (filename) {//恢复数据库
            request_plugin('pgsql_manager', 'pgsql_restore', {filename: filename, callback: 'demo.pgsql_restore'}, function (rdata) {
                alert(rdata.data);
            },);
        },
        modify_pgsql_password: function (password, username) {//修改pgsql密码
            var my_body = '<div class=" >\n' +
                '    <div class="layui-layer-title" style="cursor: move;">修改数据库密码</div>\n' +
                '    <div class="layui-layer-content">\n' +
                '        <div class="bt-form bt-form pd20 pb70">\n' +
                '            <div class="line "><span class="tname">用户名</span>\n' +
                '                <div class="info-r "><input name="name" disabled="" class="bt-input-text mr5 name_YzRFXP" type="text" style="width:330px" value="' + username + '"></div>\n' +
                '            </div>\n' +
                '            <div class="line "><span class="tname">旧密码</span>\n' +
                '                <div class="info-r "><input name="old_password" disabled="" class="bt-input-text mr5 password_YzRFXP" type="text" style="width:330px" value="' + password + '"></div>\n' +
                '            </div>\n' +
                '            <div class="line "><span class="tname">新密码</span>\n' +
                '                <div class="info-r "><input name="password"  class="bt-input-text mr5 password_YzRFXP" type="text" style="width:330px" value="" required></div>\n' +
                '            </div>\n' +
                '            <div class="bt-form-submit-btn">\n' +
                '                <button type="button" class="btn btn-sm btn-danger close_YzRFXP">关闭</button>\n' +
                '                <button type="button" class="btn btn-sm btn-success submit_modify_pgsql_password" >提交</button>\n' +
                '            </div>\n' +
                '        </div>\n' +
                '    </div>\n' +
                '</div>';
            $('.plugin_body').html(my_body);

            $(".submit_modify_pgsql_password").click(function () {
                var password = $("input[name=password]").val();
                if (password == "") {
                    alert("密码不能为空.");
                    return false;
                }
                request_plugin('pgsql_manager', 'modify_pgsql_password', {password: password, username: username, callback: 'demo.modify_pgsql_password'}, function (rdata) {
                    alert(rdata.data);
                    demo.get_database_list();
                },);
            });
        },
        modify_pgsql_listen_ip: function (listen_ip, username) {//修改pgsql用户访问权限
            var user_permission = '';
            if (listen_ip == "127.0.0.1/32") {
                user_permission = '本机'
            } else if (listen_ip == "0.0.0.0/0") {
                user_permission = '所有人'
            } else {
                user_permission = listen_ip
            }
            var my_body = '<div class=" >\n' +
                '    <div class="layui-layer-title" style="cursor: move;">修改用户访问权限</div>\n' +
                '    <div class="layui-layer-content">\n' +
                '        <div class="bt-form bt-form pd20 pb70">\n' +
                '            <div class="line "><span class="tname">用户名</span>\n' +
                '                <div class="info-r "><input name="name" disabled="" class="bt-input-text mr5 name_YzRFXP" type="text" style="width:330px" value="' + username + '"></div>\n' +
                '            </div>\n' +
                '            <div class="line "><span class="tname">旧权限</span>\n' +
                '                <div class="info-r "><input name="old_password" disabled="" class="bt-input-text mr5 password_YzRFXP" type="text" style="width:330px" value="' + user_permission + '"></div>\n' +
                '            </div>\n' +
                '            <div class="line "><span class="tname">新权限</span>\n' +
                '                <div class="info-r ">' +
                // '<input name="listen_ip"  class="bt-input-text mr5 password_YzRFXP" type="text" style="width:330px" value="">' +
                '<select name="listen_ip"  class="bt-input-text mr5 password_YzRFXP" style="width:330px">' +
                '<option value="127.0.0.1/32">本机</option>' +
                '<option value="0.0.0.0/0">所有人</option>' +
                '<option value="ip">指定网段</option>' +
                '</select>' +
                '<input  class="bt-input-text mr5" type="text" name="assignation_network" placeholder="如: 192.168.1.0/24" style="width: 203px; display: none;" required>' +
                '</div>\n' +
                '            </div>\n' +
                '            <div class="bt-form-submit-btn">\n' +
                '                <button type="button" class="btn btn-sm btn-danger close_YzRFXP">关闭</button>\n' +
                '                <button type="button" class="btn btn-sm btn-success submit_modify_pgsql_listen_ip" >提交</button>\n' +
                '            </div>\n' +
                '        </div>\n' +
                '    </div>\n' +
                '</div>';
            $('.plugin_body').html(my_body);
            $("select[name=listen_ip]").click(function () {
                if ($("select[name=listen_ip]").attr('checked') == undefined) {
                    var listen_ip_val = $("select[name=listen_ip]").val();
                    if (listen_ip_val == "ip") {
                        $("input[name=assignation_network]").css('display', 'inline-block');
                    } else {
                        $("input[name=assignation_network]").css('display', 'none');
                    }
                }
            });

            $(".submit_modify_pgsql_listen_ip").click(function () {
                var listen_ip = $("select[name=listen_ip]").val();
                if (listen_ip == "ip") {
                    listen_ip = $("input[name=assignation_network]").val()
                }
                request_plugin('pgsql_manager', 'modify_pgsql_listen_ip', {listen_ip: listen_ip, username: username, callback: 'demo.modify_pgsql_listen_ip'}, function (rdata) {
                    alert(rdata.data);
                    demo.get_database_list();
                },);
            });
        },


    };

    /**
     * 发送请求到插件
     * 注意：除非你知道如何自己构造正确访问插件的ajax，否则建议您使用此方法与后端进行通信
     * @param plugin_name    插件名称 如：demo
     * @param function_name  要访问的方法名，如：get_logs
     * @param args           传到插件方法中的参数 请传入数组，示例：{p:1,rows:10,callback:"demo.get_logs"}
     * @param callback       请传入处理函数，响应内容将传入到第一个参数中
     */
    function request_plugin(plugin_name, function_name, args, callback, timeout) {
        if (!timeout) timeout = 3600;
        $.ajax({
            type: 'POST',
            url: '/plugin?action=a&s=' + function_name + '&name=' + plugin_name,
            data: args,
            timeout: timeout,
            success: function (rdata) {
                if (!callback) {
                    layer.msg(rdata.msg, {icon: rdata.status ? 1 : 2});
                    return;
                }
                return callback(rdata);
            },
            error: function (ex) {
                if (!callback) {
                    layer.msg('请求过程发现错误!', {icon: 2});
                    return;
                }
                return callback(ex);
            }
        });
    }

    //第一次打开窗口时调用
    demo.get_service();

</script>
<!--<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>-->